require(['config'],function(){
    require(['jquery','template','cookie'],function($,template){
        $.cookie.json=true;
        const carts = $.cookie('cart');
        const html = template('shop-template',{carts});
        $('.list-body').append(html);
        $('i.totalNum').html($(".list-body").children().length);
        $('i.selectNum').html($('.list-body input[type="checkbox"]:checked').length);
        $('.cart-bar').find('em').html(0);
        //实现购物车删除操作,利用事件委派原理,指定事件委派元素
        $('.list-body').on('click','.del',e=>{
            //删除页面dom元素
            const price = [];
            const unit = $(e.target).parents('.unit');
            unit.remove();
            $('i.totalNum').html($(".list-body").children().length);
            //更新总计
            $('.list-body').find('input[type="checkbox"]:checked').each(function(){
                price.push(Number($(this).parents('.unit').find('.subTotalPrice').html()));
            })
            if(price.length!=0){
                const total = price.reduce((pre,cur)=>{
                    return pre+=cur;
                })
                $('em').html(total);
            }
            else{
                $('em').html(0);
            }
            
            //删除cookie,获取当前删除商品信息,根据ID删除
            const cartInfo = $.cookie('cart');
            const newCartInfo = cartInfo.filter(item=> item.id!=unit.data('id'));
            $.cookie('cart',newCartInfo,{expires:7});
        })

        //添加数量增加的功能
        $('.ins').on('click',e=>{
            let val = $(e.target).siblings('input[type]').val();
            if(val>9){
                alert('商品数目已达上限');
                return;
            }
            val++;
            $(e.target).siblings('input[type]').val(val);
            //计算小计
            const price = Number($(e.target).parents('.shopping-num').siblings('.shopping-price').find('.price').html().slice(0,4));
            const priceArr = []
            const subTotal = val*price;
            $(e.target).parents('.shopping-num').siblings('.shopping-total').find('.subTotalPrice').html(subTotal);
            //计算总计
            $('.list-body').find('input[type="checkbox"]:checked').each(function(){
                priceArr.push(Number($(this).parents('.unit').find('.subTotalPrice').html()));
            })
            if(priceArr.length!=0){
                const total = priceArr.reduce((pre,cur)=>{
                    return pre+=cur;
                })
                $('em').html(total);
            }
            else{
                $('em').html(0);
            }
            //更新cookie
            const cartInfo = $.cookie('cart');
            const unit = $(e.target).parents('.unit');
            const index = cartInfo.findIndex(item=>{
                return item.id == unit.data('id');
            })
            cartInfo[index].amount = val;
            $.cookie('cart',cartInfo,{expires:7});
            
        })

        //添加数量减少的功能
        $('.des').on('click',e=>{
            let val = $(e.target).siblings('input[type]').val();
            if(val<=1){
                alert('商品数目已达下限');
                return;
            }
            val--;
            $(e.target).siblings('input[type]').val(val);
            //计算小计并更新cookie
            const price = Number($(e.target).parents('.shopping-num').siblings('.shopping-price').find('.price').html().slice(0,4));
            const priceArr = [];
            const subTotal = val*price;
            $(e.target).parents('.shopping-num').siblings('.shopping-total').find('.subTotalPrice').html(subTotal);
            //更新总计
            $('.list-body').find('input[type="checkbox"]:checked').each(function(){
                priceArr.push(Number($(this).parents('.unit').find('.subTotalPrice').html()));
            })
            if(priceArr.length!=0){
                const total = priceArr.reduce((pre,cur)=>{
                    return pre+=cur;
                })
                $('em').html(total);
            }
            else{
                $('em').html(0);
            }
            //更新cookie
            const cartInfo = $.cookie('cart');
            const unit = $(e.target).parents('.unit');
            const index = cartInfo.findIndex(item=>{
                return item.id == unit.data('id');
            })
            cartInfo[index].amount = val;
            $.cookie('cart',cartInfo,{expires:7});
        })

        //实现全选功能
        const inp = $('.col-check').find('input[type]');
        const inpchecks = $('.list-body').find('input[type="checkbox"]');
        
        inp.on('click',e=>{
            const price = [];
            let check = $(e.target).prop('checked');
            if(check){
                inpchecks.each(function(){
                    $(this).prop('checked',true);
                })
                const priceAll = $('.list-body').find('.subTotalPrice');
                priceAll.each(function(){
                    price.push(Number($(this).html()));
                })
                const total = price.reduce((pre,cur)=>{
                    return pre+=cur;
                })
                $('em').html(total);
            }
            else{
                inpchecks.each(function(){
                    $(this).prop('checked',false);
                })
                $('em').html(0);
            }
            $('i.selectNum').html($('.list-body input[type="checkbox"]:checked').length);
            //
            const selectInfo = [];
            $('.unit').each(function(){
                if($(this).find('input[type="checkbox"]').prop('checked')){
                    carts.forEach(item=>{
                        if(item.id==$(this).data("id")){
                            selectInfo.push(item);
                        }
                    })
                }
            })
            localStorage.setItem('selectInfo',JSON.stringify(selectInfo));
        })
        inpchecks.each(function(){
            $(this).on('click',e=>{
                const price = [];
                const inpTrue = $('.list-body input[type="checkbox"]:checked');
                $('i.selectNum').html(inpTrue.length);
                if(inpTrue.length==$(".list-body").children().length){
                    inp.prop('checked',true);
                }
                else if(inpTrue.length<$(".list-body").children().length){
                    inp.prop('checked',false);
                }
                inpTrue.each(function(){
                   price.push(Number($(this).parents('.unit').find('.subTotalPrice').html())); 
                })
                if(price.length!=0){
                    const total = price.reduce((pre,cur)=>{
                        return pre+=cur;
                    })
                    $('em').html(total);
                }
                else{
                    $('em').html(0);
                }
                //
                const selectInfo = [];
                $('.unit').each(function(){
                    if($(this).find('input[type="checkbox"]').prop('checked')){
                        carts.forEach(item=>{
                            if(item.id==$(this).data("id")){
                                selectInfo.push(item);
                            }
                        })
                    }
                })
                localStorage.setItem('selectInfo',JSON.stringify(selectInfo));
            })
        })
    })
})